import React, { useState,useEffect } from 'react'
import { Avatar, Button, List } from 'antd-mobile'
import Header from '../../components/Header/Header'
import { $pre } from '../../http/http'


const Mine = (props) => {
  const [user, setUser] = useState({
    name: "",
    img: "",
    description: "这个人很懒什么也没留下"
  })

  useEffect(() => {
    getUserInfo()
  }, [])
  

  const getUserInfo = () => {
    setUser({
      ...user,
      name: JSON.parse(sessionStorage.getItem("isLogin")).nickname
    })
  }
  return (
    <div>
      <Header title="我的" back></Header>
      <List>
        <List.Item
          prefix={<Avatar src={$pre + user.img} />}
          description={user.description}>
          {user.name}
        </List.Item>
      </List>
      <Button block color='danger' onClick={() => {
        sessionStorage.removeItem("isLogin")
        props.history.replace("/")
      }}>退出登录</Button>
    </div>
  )
}


export default Mine